<template>
  <div class="get-record">
    <div class="record-wrapper">
      <img
        src="http://qiniu.whxgjt.com/dfh2/img_hjjj.png"
        alt="获奖记录"
        class="recode"
      />
      <img
        src="~@/assets/img/record/btn_fhsy.png"
        alt="返回首页"
        class="back-home"
        @click="back()"
      />
    </div>
    <p class="make-moon award-text">{{ makeMoon }}</p>
    <p class="first-share award-text">{{ getShare }}</p>
    <img src="http://qiniu.whxgjt.com/dfh2/ip_04.png" alt="" class="ip-04" />
  </div>
</template>

<script>
import { WxShare } from "@/utils/wxConfig";
import { lotteryRecord } from "@/api/common";

export default {
  name: "getRecord",
  data() {
    return {
      makeMoon: "",
      getShare: "",
    };
  },
  methods: {
    async getRecord() {
      const openid = localStorage.getItem("openid");
      if (!openid) return;
      this.$showLoading();
      try {
        const res = await lotteryRecord(openid);
        const data = res.data;
        if (data.errorCode === 0) {
          const rows = data.data;
          rows &&
            rows.forEach((item) => {
              if (item.lotteryType == 1) {
                this.makeMoon = item.giftName;
              } else if (item.lotteryType == 2) {
                this.getShare = item.giftName;
              }
            });
        } else {
          console.log(data);
        }
      } catch (e) {
        console.log(e);
      }
      this.$closeLoading();
    },
    back() {
      this.$router.push("/");
    },
  },
  mounted() {
    WxShare();
    this.getRecord();
  },
};
</script>

<style lang="scss" scoped>
.get-record {
  width: 100%;
  height: 100%;
  min-height: 100vh;
  overflow: hidden;
  background-image: url("http://qiniu.whxgjt.com/dfh2/bg_dt.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  box-sizing: border-box;
  position: relative;

  .record-wrapper {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 93px;
    .recode {
      height: 294px;
    }
    .back-home {
      height: 88px;
      margin-top: -15px;
    }
  }

  .make-moon {
    position: absolute;
    top: 200px;
  }

  .first-share {
    position: absolute;
    top: 290px;
  }

  .ip-04 {
    width: 100%;
    height: 112px;
    position: absolute;
    bottom: 0;
  }
}

.award-text {
  width: 100%;
  font-size: 16px;
  font-family: SourceHanSansCN;
  font-weight: 500;
  color: #b0612d;
  text-align: center;
}
</style>